import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import $ from 'jquery';
import './base.scss';
class Com extends Component {
    constructor (props) {
      super(props)
      this.state = {
        path:{
          pathname:'/sousuo',
          yhsr:[]
        }
      }
    }
    search(){
      const inpVal = this.input.value
      this.state.path.yhsr=inpVal
    }
    topactive (event) {
      var currentNode = event.currentTarget;
      console.log($(currentNode).attr('class','headertopactive').siblings())
      $(currentNode).attr('class','headertopactive').siblings().removeClass('headertopactive');
    }
    render () {
        return (
          <header className = "header">
            <div className = "hea">
              <Link to ="/" className = "hhh"><h1>古诗文网</h1></Link>
              <div className="nav">
                <ul>
                  <li onClick={this.topactive.bind(this)}>
                    <Link to="/tuijian">推荐</Link>
                  </li>
                  <li onClick={this.topactive.bind(this)}>
                    <Link to="/shiwen">诗文</Link>
                  </li>
                  <li>
                    <Link to="/mingju">名句</Link>
                  </li>
                  <li>
                    <Link to="/zuozhe">作者</Link>
                  </li>
                  <li>
                    <Link to="/guji">古籍</Link>
                  </li>
                  <li>
                    <Link to="/collect">收藏</Link>
                  </li>
                  <li>
                    <Link to="/ipone">手机版</Link>
                  </li>
                </ul>
                <div className="sou">
                  <input type="text" placeholder="搜索" ref={input => this.input = input} />
                  <Link to={this.state.path} onClick={this.search.bind(this)}><span className="iconfont icon-Magnifier"></span></Link>
                </div>
              </div>
          </div> 
        </header>
        )
    }
}

export default Com;